import React, {Component} from 'react';
// 引入store,通过store里面所存的拿到数据
import store from "../../redux/store";
import {createIncrementAction,createDecrementAction} from "../../redux/count_actions_creator"
class Count extends Component {
   /*componentDidMount() {
      // 检测redux有没有变化,有变化就调用render
       store.subscribe(()=>{
           this.setState({})
       })
   }*/

    increment = () => {
        // 获取要选的值
        const {value} = this.selectNum
        store.dispatch(createIncrementAction(value*1))

    }
    decrement = () => {
        const {value} = this.selectNum
        store.dispatch(createDecrementAction(value*1))


    }
    incrementIfOdd = () => {
        const {value} = this.selectNum

        const count = store.getState()

        if(count % 2 !==0){
            store.dispatch(createIncrementAction(value*1))
        }




    }
    incrementAsync = () => {
        const {value} = this.selectNum
        setTimeout(()=>{
            store.dispatch(createIncrementAction(value*1))
        },1000)


    }

    render() {
        return (
            <div>
                <h2>当前求和为:{store.getState()}</h2>
                <select ref={c => this.selectNum = c}>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                </select>&nbsp;
                <button onClick={this.increment}>+</button>
                &nbsp;
                <button onClick={this.decrement}>-</button>
                &nbsp;
                <button onClick={this.incrementIfOdd}>和为奇数再加</button>
                &nbsp;
                <button onClick={this.incrementAsync}>异步加</button>

            </div>
        );
    }
}

export default Count;
